<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title>mnhart. imagine, design, build</title>

    <!-- Bootstrap -->
    <link href="css/bootstrap.min.css" rel="stylesheet">
    <link href="css/style.css" rel="stylesheet">
    <script src="http://code.jquery.com/jquery.js"></script>
    <link href='http://fonts.googleapis.com/css?family=Roboto' rel='stylesheet' type='text/css'>
    <link href='http://fonts.googleapis.com/css?family=Roboto+Slab:700' rel='stylesheet' type='text/css'>
    <link href="//maxcdn.bootstrapcdn.com/font-awesome/4.1.0/css/font-awesome.min.css" rel="stylesheet">
    <!--
    <script type="text/javascript">
        jQuery(document).ready(function(){
            jQuery('#demo1').skdslider({'delay':5000, 'animationSpeed': 2000,'showNextPrev':true,'showPlayButton':true,'autoSlide':true,'animationType':''});
            jQuery('#demo2').skdslider({'delay':5000, 'animationSpeed': 1000,'showNextPrev':true,'showPlayButton':false,'autoSlide':true,'animationType':'sliding'});
            jQuery('#demo3').skdslider({'delay':5000, 'animationSpeed': 1000,'showNextPrev':true,'autoSlide':true,'animationType':'sliding'});
            
            jQuery('#responsive').change(function(){
              $('#responsive_wrapper').width(jQuery(this).val());
            });
            
        });
    </script>
-->
    <script type="text/javascript">       
    $(document).ready(function(){
        $('#my-slide').DrSlider({
            'positionControl': 'bottom-center',
            'showNavigation': false,
            transitionSpeed: 1000,
            duration: 10000
        }); //Yes! that's it!
    });
</script> 


    <!-- HTML5 Shim and Respond.js IE8 support of HTML5 elements and media queries -->
    <!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
    <!--[if lt IE 9]>
      <script src="https://oss.maxcdn.com/libs/html5shiv/3.7.0/html5shiv.js"></script>
      <script src="https://oss.maxcdn.com/libs/respond.js/1.4.2/respond.min.js"></script>
    <![endif]-->
  </head>
  <body>
<!-- Navigation -->
    <nav class="navbar navbar-default navbar-fixed-top">
        <div class="container">
            <!-- Brand and toggle get grouped for better mobile display -->
            <div class="navbar-header page-scroll">
                <button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1">
                    <span class="sr-only">Toggle navigation</span>
                    <span class="icon-bar"></span>
                    <span class="icon-bar"></span>
                    <span class="icon-bar"></span>
                </button>
                <a class="navbar-brand scroll" href="#page-top">
                    <img class="logo" src="images/snekkia_logo.png" />
                </a>
            </div>

            <!-- Collect the nav links, forms, and other content for toggling -->
            <div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
                <ul class="nav navbar-nav navbar-right main-menu">
                    <li class="hidden">
                        <a href="#page-top"></a>
                    </li>
                    <li class="page-scroll">
                        <a class="scroll" href="#page-top">home</a>
                    </li>
                    <li class="page-scroll">
                        <a class="scroll" href="#portfolio">portfolio</a>
                    </li>
                    <li class="page-scroll">
                        <a class="scroll" href="#about">about</a>
                    </li>
                    <li class="page-scroll">
                        <a class="scroll" href="#contact">contact</a>
                    </li>
                </ul>
            </div>
            <!-- /.navbar-collapse -->
        </div>
        <!-- /.container-fluid -->
    </nav>

  <div id="my-slide">
    <!--
            <img data-lazy-src="images/1.jpg" />
            <img data-lazy-src="images/2.jpg" />
            <img data-lazy-src="images/3.jpg" />
-->
           
            <div data-lazy-background="images/1.jpg">
               
                <div class="slide-header" data-pos="['0%', '0%', '20%', '10%']" data-duration="0" data-effect="move" data-delay="10">
                    Outstanding User Experience
                </div>
                <div class="slide-text" data-pos="['33%', '-40%', '33%', '10%']" data-duration="0" data-effect="move" data-delay="10">
                    Boost your sales with a clean, modern website with intuitive design crafted to fit various devices and platforms. Your visitors will love it and will share their love with others.

                </div>
            </div>
            
            <div data-lazy-background="images/2.jpg">
                  <div class="slide-header" data-pos="['0%', '0%', '20%', '10%']" data-duration="0" data-effect="move" data-delay="10">
                    Outstanding User Experience
                </div>
                <div class="slide-text" data-pos="['33%', '-40%', '33%', '10%']" data-duration="0" data-effect="move" data-delay="10">
                    Boost your sales with a clean, modern website with intuitive design crafted to fit various devices and platforms. Your visitors will love it and will share their love with others.

                </div>
            </div>
               
            <div data-lazy-background="images/3.jpg">
                  <div class="slide-header" data-pos="['0%', '0%', '20%', '10%']" data-duration="0" data-effect="move" data-delay="10">
                    Outstanding User Experience
                </div>
                <div class="slide-text" data-pos="['33%', '-40%', '33%', '10%']" data-duration="0" data-effect="move" data-delay="10">
                    Boost your sales with a clean, modern website with intuitive design crafted to fit various devices and platforms. Your visitors will love it and will share their love with others.

                </div>
            </div>
            
            <!--
            <img data-lazy-src="http://devrama.com/static/devrama-slider/images/4247776023_81a3f048ca_b.png" />
            <img data-lazy-src="http://devrama.com/static/devrama-slider/images/4277941123_044d26b6df_b.png" />
            <img data-lazy-src="http://devrama.com/static/devrama-slider/images/4432435310_d5010f8efc_b.png" />
            <img data-lazy-src="http://devrama.com/static/devrama-slider/images/6240134386_db0f314ef6_b.png" />
        -->
        </div>

    <header>
        <!--
        <div id="page-top"></div>
            <div class="container">
            <div id="maintext" class="col-md-6">
            <h1 class="main">Hello,</h1>
            <p class="lead main">I’m Lorant Menehart and I’m a superhero.
               Ok, almost; actually I’m a freelance graphic and web designer currently living in Liverpool. I like to play
               around with ideas, concepts, put them all together and make them work.</p>
            
            
            <p class='lead main'>Have a look around and if you like what see, 
                let's have a coffee and talk about your project.</p>
            <a class="btn btn-success btn-lg scroll" href="#contact">Get in Touch</a>
            </div>
                <div id="featuredimg" class="col-md-5">
                    <img src="images/imac-front.png" class="img-responsive" alt="imagine, design, build"/>
                </div>
            </div>
        
        bancsi
        -->

        <!--

       <h4>Responsive Demo:  Select Width:<select id="responsive"><option value="100%">Full Width</option><option selected="selected" value="800">800px</option><option value="640">640px</option><option value="480">480px</option></select></h4>
       -->



    </header>
     
     <section class="container">
        
        <h2>Services</h2>
        <p>Lorem Ipsum este pur şi simplu o machetă pentru text a industriei tipografice. Lorem Ipsum a fost macheta standard a industriei încă din secolul al XVI-lea, când un tipograf anonim a luat o planşetă de litere şi le-a amestecat pentru a crea o carte demonstrativă pentru literele respective. Nu doar că a supravieţuit timp de cinci secole, dar şi a facut saltul în tipografia electronică practic neschimbată. A fost popularizată în anii '60 odată cu ieşirea colilor Letraset care conţineau pasaje Lorem Ipsum, iar mai recent, prin programele de publicare pentru calculator, ca Aldus PageMaker care includeau versiuni de Lorem Ipsum.</p>
    </div>
    </section>
                 

    <section class="container">
        
        <h2> Our Portfolio</h2>
        <div id="portfolio">
        
        <ul class="nav nav-tabs">
            <li class="active"><a href="#home" data-toggle="tab">
                <h4>Web Design</h4></a></li>
            <li class=""><a href="#logo" data-toggle="tab">
                <h4>Corporate Identity</h4></a></li>
            <li class=""><a href="#print" data-toggle="tab">
                <h4>Print Materials</h4></a></li>
        </ul>

        <!-- Tab panes -->
        <div class="tab-content">
            <div class="tab-pane active" id="home">
                    <div class="row">
                <div class="col-md-4">
                    <a data-toggle="modal" href="#themodal" title="Website for Neurostar"
                       data-img-url="images/webdesign/neurostar.jpg" data-url="http://robot-stereotaxic.com">
                    <div class="rollover">
                            <div class="caption-content">
                                <div class="caption-texts">
                                <p class="fa fa-search-plus fa-5x"></p>
                                <p class="learn">View Project</p>
                                </div>
                                
                            </div>
                        </div>
                        <img src="images/thumbs/neurostarthumb.jpg" class="img-responsive"/></a>
                </div>
                <div class="col-md-4">
                    <a data-toggle="modal" href="#themodal" title="Travelclub custom Wordpress theme"
                       data-img-url="images/webdesign/travelclub.jpg" data-url="http://travelclub.bestcj.ro">
                    <div class="rollover">
                            <div class="caption-content">
                                <div class="caption-texts">
                                <p class="fa fa-search-plus fa-5x"></p>
                                <p class="learn">View Project</p>
                                </div>
                            </div>
                        </div>
                        <img src="images/thumbs/travelthumb.jpg" class="img-responsive"/></a>
                </div>
                <div class="col-md-4">
                    <a data-toggle="modal" href="#themodal" title="Website for Donau Invest"
                       data-img-url="images/webdesign/donau.jpg" data-url="http://donauinvest.ro">
                    <div class="rollover">
                            <div class="caption-content">
                                <div class="caption-texts">
                                <p class="fa fa-search-plus fa-5x"></p>
                                <p class="learn">View Project</p>
                                </div>
                            </div>
                        </div>
                        <img src="images/thumbs/donauthumb.jpg" class="img-responsive"/></a>
                </div>
                    </div>
                <div class="row">
                <div class="col-md-4">
                    <a data-toggle="modal" href="#themodal" title="Vegan Bistro Website"
                       data-img-url="images/webdesign/greenfood.jpg" data-url='#'>
                    <div class="rollover">
                            <div class="caption-content">
                                <div class="caption-texts">
                                <p class="fa fa-search-plus fa-5x"></p>
                                <p class="learn">View Project</p>
                                </div>
                            </div>
                        </div>
                        <img src="images/thumbs/greenfoodthumb.jpg" class="img-responsive"/></a>
                </div>
                <div class="col-md-4">
                    <a data-toggle="modal" href="#themodal" title="Pinlocal Website"
                       data-img-url="images/webdesign/pin.jpg" data-url="#">
                    <div class="rollover">
                            <div class="caption-content">
                                <div class="caption-texts">
                                <p class="fa fa-search-plus fa-5x"></p>
                                <p class="learn">View Project</p>
                                </div>
                            </div>
                        </div>
                        <img src="images/thumbs/pinlocalthumb.jpg" class="img-responsive"/></a>
                </div>
                <div class="col-md-4">
                    <a data-toggle="modal" href="#themodal" title="Website for Skin London"
                       data-img-url="images/webdesign/skin.jpg" data-url="http://skinlondon.co.uk">
                    <div class="rollover">
                            <div class="caption-content">
                                <div class="caption-texts">
                                <p class="fa fa-search-plus fa-5x"></p>
                                <p class="learn">View Project</p>
                                </div>
                            </div>
                        </div>
                        <img src="images/thumbs/skinlondonthumb.jpg" class="img-responsive"/></a>
                </div>
                    </div>
                <div class="row last">
                <div class="col-md-4">
                    <a data-toggle="modal" href="#themodal" title="JobShop 2011 Website"
                       data-img-url="images/webdesign/jobshop.jpg" data-url="http://cluj.jobshop.ro/2011">
                    <div class="rollover">
                            <div class="caption-content">
                                <div class="caption-texts">
                                <p class="fa fa-search-plus fa-5x"></p>
                                <p class="learn">View Project</p>
                                </div>
                            </div>
                        </div>
                        <img src="images/thumbs/jobshopthumb.jpg" class="img-responsive"/></a>
                </div>
                <div class="col-md-4">
                    <a data-toggle="modal" href="#themodal" title="Flowers Bistro Web Design"
                       data-img-url="images/webdesign/flowers.jpg" data-url="#">
                    <div class="rollover">
                            <div class="caption-content">
                                <div class="caption-texts">
                                <p class="fa fa-search-plus fa-5x"></p>
                                <p class="learn">View Project</p>
                                </div>
                            </div>
                        </div>
                        <img src="images/thumbs/flowersthumb.jpg" class="img-responsive"/></a>
                </div>
                <div class="col-md-4">
                    <a data-toggle="modal" href="#themodal" title="Hedaco online store"
                       data-img-url="images/webdesign/hedaco.jpg" data-url="#">
                    <div class="rollover">
                            <div class="caption-content">
                                <div class="caption-texts">
                                <p class="fa fa-search-plus fa-5x"></p>
                                <p class="learn">View Project</p>
                                </div>
                            </div>
                        </div>
                        <img src="images/thumbs/hedacothumb.jpg" class="img-responsive"/></a>
                </div>
                    </div>
                
                
  
  
            </div>
            <div class="tab-pane" id="logo">
                
                 <div class="row">
                <div class="col-md-4">
                    <a data-toggle="modal" href="#themodal" title="MyCoolGadget logo"
                       data-img-url="images/logo/gadget.jpg" data-url="#">
                    <div class="rollover">
                            <div class="caption-content">
                                <div class="caption-texts">
                                <p class="fa fa-search-plus fa-5x"></p>
                                <p class="learn">View Project</p>
                                </div>
                                
                            </div>
                        </div>
                        <img src="images/logothumbs/mycool.jpg" class="img-responsive"/></a>
                </div>
                <div class="col-md-4">
                    <a data-toggle="modal" href="#themodal" title="Gerd Leonhard Green Futurist logo"
                       data-img-url="images/logo/gerdleonhard.jpg" data-url="#">
                    <div class="rollover">
                            <div class="caption-content">
                                <div class="caption-texts">
                                <p class="fa fa-search-plus fa-5x"></p>
                                <p class="learn">View Project</p>
                                </div>
                            </div>
                        </div>
                        <img src="images/logothumbs/gerd.jpg" class="img-responsive"/></a>
                </div>
                <div class="col-md-4">
                    <a data-toggle="modal" href="#themodal" title="IPVOX Canada"
                       data-img-url="images/logo/ipvoxlogo.jpg" data-url="#">
                    <div class="rollover">
                            <div class="caption-content">
                                <div class="caption-texts">
                                <p class="fa fa-search-plus fa-5x"></p>
                                <p class="learn">View Project</p>
                                </div>
                            </div>
                        </div>
                        <img src="images/logothumbs/ipvox.jpg" class="img-responsive"/></a>
                </div>
                    </div>
                <div class="row">
                <div class="col-md-4">
                    <a data-toggle="modal" href="#themodal" title="Books4U Corporate Identity"
                       data-img-url="images/logo/books.jpg" data-url="#">
                    <div class="rollover">
                            <div class="caption-content">
                                <div class="caption-texts">
                                <p class="fa fa-search-plus fa-5x"></p>
                                <p class="learn">View Project</p>
                                </div>
                            </div>
                        </div>
                        <img src="images/logothumbs/books.jpg" class="img-responsive"/></a>
                </div>
                <div class="col-md-4">
                    <a data-toggle="modal" href="#themodal" title="HikariPRO Logo"
                       data-img-url="images/logo/sample.jpg" data-url="#">
                    <div class="rollover">
                            <div class="caption-content">
                                <div class="caption-texts">
                                <p class="fa fa-search-plus fa-5x"></p>
                                <p class="learn">View Project</p>
                                </div>
                            </div>
                        </div>
                        <img src="images/logothumbs/hikari.jpg" class="img-responsive"/></a>
                </div>
                <div class="col-md-4">
                    <a data-toggle="modal" href="#themodal" title="Elephant Network"
                       data-img-url="images/logo/en.jpg" data-url="#">
                    <div class="rollover">
                            <div class="caption-content">
                                <div class="caption-texts">
                                <p class="fa fa-search-plus fa-5x"></p>
                                <p class="learn">View Project</p>
                                </div>
                            </div>
                        </div>
                        <img src="images/logothumbs/en.jpg" class="img-responsive"/></a>
                </div>
                    </div>
                <div class="row last">
                <div class="col-md-4">
                    <a data-toggle="modal" href="#themodal" title="Logo for Sitenow"
                       data-img-url="images/logo/sitenow.jpg" data-url="#">
                    <div class="rollover">
                            <div class="caption-content">
                                <div class="caption-texts">
                                <p class="fa fa-search-plus fa-5x"></p>
                                <p class="learn">View Project</p>
                                </div>
                            </div>
                        </div>
                        <img src="images/logothumbs/sitenow.jpg" class="img-responsive"/></a>
                </div>
                <div class="col-md-4">
                    <a data-toggle="modal" href="#themodal" title="Blue Sun Corporate Identity"
                       data-img-url="images/logo/blueplanet.jpg" data-url="#">
                    <div class="rollover">
                            <div class="caption-content">
                                <div class="caption-texts">
                                <p class="fa fa-search-plus fa-5x"></p>
                                <p class="learn">View Project</p>
                                </div>
                            </div>
                        </div>
                        <img src="images/logothumbs/bluesun.jpg" class="img-responsive"/></a>
                </div>
                <div class="col-md-4">
                    <a data-toggle="modal" href="#themodal" title="Jorge Lee logo"
                       data-img-url="images/logo/jorgelee.jpg" data-url="#">
                    <div class="rollover">
                            <div class="caption-content">
                                <div class="caption-texts">
                                <p class="fa fa-search-plus fa-5x"></p>
                                <p class="learn">View Project</p>
                                </div>
                            </div>
                        </div>
                        <img src="images/logothumbs/jorgelee.jpg" class="img-responsive"/></a>
                </div>
                    </div>
            
            </div>
            <div class="tab-pane" id="print">
             <div class="row">
                <div class="col-md-4">
                    <a data-toggle="modal" href="#themodal" title="PinLocal brochure"
                       data-img-url="images/print/pinlocal.jpg" data-url="#">
                    <div class="rollover">
                            <div class="caption-content">
                                <div class="caption-texts">
                                <p class="fa fa-search-plus fa-5x"></p>
                                <p class="learn">View Project</p>
                                </div>
                                
                            </div>
                        </div>
                        <img src="images/printthumbs/pinlocal.jpg" class="img-responsive"/></a>
                </div>
                <div class="col-md-4">
                    <a data-toggle="modal" href="#themodal" title="Show Brasil Poster"
                       data-img-url="images/print/brazil.jpg" data-url="#">
                    <div class="rollover">
                            <div class="caption-content">
                                <div class="caption-texts">
                                <p class="fa fa-search-plus fa-5x"></p>
                                <p class="learn">View Project</p>
                                </div>
                            </div>
                        </div>
                        <img src="images/printthumbs/brasil.jpg" class="img-responsive"/></a>
                </div>
                <div class="col-md-4">
                    <a data-toggle="modal" href="#themodal" title="Spring Courses Brochure"
                       data-img-url="images/print/buzz.jpg" data-url="#">
                    <div class="rollover">
                            <div class="caption-content">
                                <div class="caption-texts">
                                <p class="fa fa-search-plus fa-5x"></p>
                                <p class="learn">View Project</p>
                                </div>
                            </div>
                        </div>
                        <img src="images/printthumbs/buzz.jpg" class="img-responsive"/></a>
                </div>
                    </div>
                <div class="row">
                <div class="col-md-4">
                    <a data-toggle="modal" href="#themodal" title="My Cool Gadget business cards"
                       data-img-url="images/print/cool.jpg" data-url="#">
                    <div class="rollover">
                            <div class="caption-content">
                                <div class="caption-texts">
                                <p class="fa fa-search-plus fa-5x"></p>
                                <p class="learn">View Project</p>
                                </div>
                            </div>
                        </div>
                        <img src="images/printthumbs/cool.jpg" class="img-responsive"/></a>
                </div>
                <div class="col-md-4">
                    <a data-toggle="modal" href="#themodal" title="FAB leaflet"
                       data-img-url="images/print/fab.jpg" data-url="#">
                    <div class="rollover">
                            <div class="caption-content">
                                <div class="caption-texts">
                                <p class="fa fa-search-plus fa-5x"></p>
                                <p class="learn">View Project</p>
                                </div>
                            </div>
                        </div>
                        <img src="images/printthumbs/fab.jpg" class="img-responsive"/></a>
                </div>
                <div class="col-md-4">
                    <a data-toggle="modal" href="#themodal" title="BattleLab Robotica"
                       data-img-url="images/print/blr.jpg" data-url="#">
                    <div class="rollover">
                            <div class="caption-content">
                                <div class="caption-texts">
                                <p class="fa fa-search-plus fa-5x"></p>
                                <p class="learn">View Project</p>
                                </div>
                            </div>
                        </div>
                        <img src="images/printthumbs/blr.jpg" class="img-responsive"/></a>
                </div>
                    </div>
                <div class="row last">
                <div class="col-md-4">
                    <a data-toggle="modal" href="#themodal" title="CoSource brochure"
                       data-img-url="images/print/cosource.jpg" data-url="#">
                    <div class="rollover">
                            <div class="caption-content">
                                <div class="caption-texts">
                                <p class="fa fa-search-plus fa-5x"></p>
                                <p class="learn">View Project</p>
                                </div>
                            </div>
                        </div>
                        <img src="images/printthumbs/cosource.jpg" class="img-responsive"/></a>
                </div>
                <div class="col-md-4">
                    <a data-toggle="modal" href="#themodal" title="BEST Engineering competition"
                       data-img-url="images/print/bec.jpg" data-url="#">
                    <div class="rollover">
                            <div class="caption-content">
                                <div class="caption-texts">
                                <p class="fa fa-search-plus fa-5x"></p>
                                <p class="learn">View Project</p>
                                </div>
                            </div>
                        </div>
                        <img src="images/printthumbs/bec.jpg" class="img-responsive"/></a>
                </div>
                <div class="col-md-4">
                    <a data-toggle="modal" href="#themodal" title="JobShop 2011"
                       data-img-url="images/print/jobshop.jpg" data-url="#">
                    <div class="rollover">
                            <div class="caption-content">
                                <div class="caption-texts">
                                <p class="fa fa-search-plus fa-5x"></p>
                                <p class="learn">View Project</p>
                                </div>
                            </div>
                        </div>
                        <img src="images/printthumbs/jobshop.jpg" class="img-responsive"/></a>
                </div>
                    </div>
            </div>
            </div>
        </div>
              
    </section>

    <section id="modals">

    <!-- Modal -->
<div class="modal fade" id="themodal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
  <div class="modal-dialog">
    <div class="modal-content">
      <div class="modal-header">
        <div class="pull-left">
        <h4 class="modal-title" id="myModalLabel"></h4>
        </div>
          <div class="pull-right">
        <button type="button" class="btn btn-default btn-sm" data-dismiss="modal" aria-hidden="true">Close</button>
        </div>
        <div class="pull-right">
            <div id='visitsite'>
                <a href="#" class="btn btn-success btn-sm" role="button" target="_blank">Visit Site</a></div>
        </div>
        <div class="clearfix"></div>
      </div>
      <div class="modal-body">
          <img src="#" alt="Neurostar web design">
      </div>
    </div>
  </div>
</div>
    
    </section>

<section id="about">
    
    <div class="container">
        <div id="personal">
            <h2>About Me</h2>
            <div class="row">
            <div class="col-md-2">
                <img src="images/lorant.jpg" alt="lorant"/>
            </div>
                 <div class="col-md-10">
                     <p>25 years old, I'm a self-taught designer, full-time web enthusiast and part-time volunteer.
                <br>I have a BSc in Applied Electronics and I study human behaviour independently. I'm pretty much fascinated about how the
                human mind works and that's why my goal is to create smart, intuitive designs that sell.
                </p>
                <p>
                Below you'll find a short description of how I like
                to "tackle" projects, if you want to find out more about me you can <a href="cv.pdf">view/download my CV</a> or <a class="scroll" href="#contact">get in touch</a>.</p>
                 </div></div>
            
        </div>
        <div class="row aboutcenter first">
        <div class="col-md-8 aboutcentercol">
            <h2>Imagine</h2>
        <p>Every project starts with an idea. Your precious. And you want others to know about it, now and forever...and for that
            you need a plan.
            
            I can help you plan, I can help you answer the Five Ws, find the strengths and weaknesses,
            opportunities and threats that surround your idea. </p>
        <p>
            We can work together to define your goal and choose a solution
            that takes you there.
        </p>
        <h3>This first step is about:</h3>
        <ul>
            <li><span class="glyphicon glyphicon-circle-arrow-right"></span>
                <strong>Vision</strong> - Defining your aspirations, your business goals for the future</li>
            <li><span class="glyphicon glyphicon-circle-arrow-right"></span>
                <strong>Mission</strong> - What is it that you're doing now to achieve your goals</li>
            <li><span class="glyphicon glyphicon-circle-arrow-right"></span>
                <strong>Market Research</strong> - What is your target market, and how can your idea help them</li>
            <li><span class="glyphicon glyphicon-circle-arrow-right"></span>
                <strong>Strategy</strong> - What are we going to do to advertise your idea</li>
            <li><span class="glyphicon glyphicon-circle-arrow-right"></span>
                <strong>Timeline</strong> - An overview of all the steps, deadlines, milestones</li>
        </ul>
        
        </div>
        <div id="lightbulb" class="col-md-4 aboutcentercol">
            <img src="images/light.png" alt="imagine" class="img-responsive"/>
        </div>
        </div>
        <hr>
        <div class="row aboutcenter">
        
        <div id="pencil" class="col-md-4 aboutcentercol">
            <img src="images/pencil.png" alt="design" class="img-responsive"/>
        </div>
            
            <div class="col-md-8 aboutcentercol">
            
        <h2>Design</h2>
            <p>Your idea needs a shape, a visual representation of its core values. It's not just about the aesthetics, it's more about
            transmitting the right message. I like to design conversion oriented materials; websites, leaflets, brochures that
            sell your products or services.</p>
            
            <h3>Here we talk about:</h3>
             
            <ul>
            <li><span class="glyphicon glyphicon-circle-arrow-right"></span>
                <strong>Layout</strong> - The structure of the final product; pages, sections, containers...</li>
            <li><span class="glyphicon glyphicon-circle-arrow-right"></span>
                <strong>User experience</strong> - Let's make the user's life as easy as possible</li>
            <li><span class="glyphicon glyphicon-circle-arrow-right"></span>
                <strong>Graphics</strong> - Color combinations, styles, icons, typography.</li>
            <li><span class="glyphicon glyphicon-circle-arrow-right"></span>
                <strong>Images</strong> - The biggest cliche of them all: an image is worth a thousand words</li>
            <li><span class="glyphicon glyphicon-circle-arrow-right"></span>
                <strong>Feedback</strong> - Communication ensures a great result. Simple as that :)</li>
 
            </ul>
            
            </div>
        </div>
            <hr>
        <div class="row aboutcenter">
        
        <div class="col-md-8 aboutcentercol">
        <h2>Build</h2>
        <p>The stage where your idea finally comes alive. And it's crucial to be built on a solid structure. Clean, semantic code
            that is up to date with the latest developments in web-design, including user friendly content 
            management systems that allow you to easily update your website yourself.<p>
            
            <h3>We move on to:</h3>
             
            <ul>
            <li><span class="glyphicon glyphicon-circle-arrow-right"></span>
                <strong>Code</strong> - Front-end technologies, Content Management Systems, functionality</li>
            <li><span class="glyphicon glyphicon-circle-arrow-right"></span>
                <strong>Content</strong> - Populating your website with content</li>
            <li><span class="glyphicon glyphicon-circle-arrow-right"></span>
                <strong>SEO</strong> - Search Engine Optimization. Becoming friends with Google</li>
            <li><span class="glyphicon glyphicon-circle-arrow-right"></span>
                <strong>Advertising</strong> - Getting noticed. Online and offline marketing.</li>
 
            </ul>
        </div>
        <div id="wrench" class="col-md-4 aboutcentercol">
            <img src="images/wrench.png" alt="build" class="img-responsive"/>
        </div>
        
    </div>
    
</section>

<section id="contact">
    <div class="container">
        <h2>Get in Touch</h2>
        <div class="row">
            <div class="col-md-6">
                <address>
                    <p><strong>Email:</strong> lorant@mnhart.eu</p>
                    <p><strong>Skype:</strong> menehart.lorant</p>
                    <p><strong>Phone:</strong> 07934124646</p>
                   
                    
                    
                </address>
            </div>
            <div class="col-md-6">
                <!--<iframe src="https://www.google.com/maps/embed?pb=!1m18!1m12!1m3!1d2379.1331511170906!2d-2.9791299999999876!3d53.394557999999996!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x487b20d8fae71e17%3A0x3166cd86659db768!2s25+Parliament+St!5e0!3m2!1sen!2s!4v1404836107881" width="600" height="150" frameborder="0" style="border:0"></iframe>-->
            </div>
        </div>
    </div>
</section>
<section id="footer">
    <div class="container">
    <p>Copyright 2014 Lorant Menehart. EU VAT number RO32823579</p>
    </div>
</section>


    <!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
    <!-- Include all compiled plugins (below), or include individual files as needed -->
    <script src="js/bootstrap.min.js"></script>
    <script type="text/javascript" src="js/jquery.devrama.slider.js"></script>
    <script type='text/javascript'>
         var hashTagActive = "";
    $(".scroll").click(function (event) {
        if(hashTagActive != this.hash) { //this will prevent if the user click several times the same link to freeze the scroll.
            event.preventDefault();
            //calculate destination place
            var dest = 0;
            if ($(this.hash).offset().top > $(document).height() - $(window).height()) {
                dest = $(document).height() - $(window).height();
            } else {
                dest = $(this.hash).offset().top;
            }
            //go to destination
            $('html,body').animate({
                scrollTop: dest
            }, 500, 'swing');
            hashTagActive = this.hash;
        }
    });
    </script>
    <script type="text/javascript">
    $('.col-md-4 a').click(function(e) {
    var title=$(this).attr('title'); 
    $('#themodal img').attr('src', $(this).attr('data-img-url')); 
    $('.modal-header a').attr('href', $(this).attr('data-url'));
    if ($(this).attr('data-url')=='#'){
    document.getElementById("visitsite").style.display="none";
    } else {
    document.getElementById("visitsite").style.display="inline"; 
    }
    $('#myModalLabel').text(title);
});
    
</script>
<script>
  (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
  (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
  m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
  })(window,document,'script','//www.google-analytics.com/analytics.js','ga');

  ga('create', 'UA-38072118-3', 'auto');
  ga('send', 'pageview');

</script>
  </body>
</html>